<template>
  <!-- 新增编辑弹窗 -->
<!--新增监测点-->
  <div class="page_monitor-add">
    <div class="detail-header">
      {{projectDetail.name}}/{{workPointName}}
    </div>
      <!-- 页面title -->
    <div class="page-title">新增监测点</div>

    <form-add-edit ref="formAdd"></form-add-edit>

    <!-- 操作按钮 -->
    <span slot="footer" class="dialog-footer" style="margin-left: 41%">
      <el-button class="common_btn-white" @click="isShowDialog = false">取消</el-button>
      <el-button type="primary" class="common_btn-defalut" @click="validateForm">确定</el-button>
    </span>
</div>
</template>

<script>
import FormAddEdit from './modules/form-add-edit'
import { actions, store } from '../work-point.store'

export default {
  components: { FormAddEdit },
  data () {
    return {
    }
  },
  // computed: {
  //   // 弹窗的title
  //   dialogTitle () {
  //     return this.currentRow.id ? '编辑监测点' : '新增监测点'
  //   }
  // },
  computed: {
    projectDetail () {
      return store.projectInfo
    },
    workPointName () {
      const {
        workPointId
      } = this.$route.params
      const info = store.workPointList.find(x => x.id === workPointId) || {}
      return info.name
    },
  },
  methods: {
    // 新增数据
    handleAdd () {
      const { workPointId } = this.$route.params
      if (!workPointId) {
        this.$notify({
          title: '提示',
          message: '获取工点id失败，请刷新重试',
          type: 'error'
        })
        return false
      }
      this.$nextTick(() => {
        this.$refs.formAdd.handleAdd(workPointId)
      })
    },
    // 表单校验
    validateForm () {
      return new Promise((resolve, reject) => {
        this.$refs.formAdd.validateForm(resolve, reject)
      }).then(async () => {
        const { projectId } = this.$route.params
        await actions.queryWorkPointList(projectId)
        // 清空数据
        this.handleAdd()
      })
    }
  },
  created () {
    this.handleAdd()
  }
}
</script>
<style lang="less" scoped>
.detail-header{
  color: #1990FE ;
}
  .page_monitor-add {
    width: 1200px;
    margin: 0 auto;
    .page-title {
      padding: 28px;
      font-size: 20px;
      line-height: 28px;
      color: white;
    }
  }
</style>
